<template>
	<div>
		<div class="col-sm-3 col-xs-6 text-center film-infor" v-for="item in dataJson">
			<div class="film-a">
				<router-link :to="item.url">
					<img :src="item.imgUrl" class="film-imgs"> 
					<h5 class="film-h5">{{item.name}}</h5>
				</router-link>
			</div>
		</div>
	</div>
</template>

<script>
	export default{
		props : {
			dataJson : {
				type : Array,
				required : true
			}
		},
		mounted ($route) {
	 		this.$nextTick(()=>{
	 		})
	 	},
	}
</script>

<style scoped>
	.film-infor{
	    margin-top: 20px;
	}
	.film-a{
	    padding: 5px;
		border: 1px solid #dfdfdf;
		height: 202px;
	}
	.film-imgs{
	    width: 100%;
    	height: 160px;
	}
	.film-h5{
	    margin: 0px;
	    background: rgba(0,0,0,0.8);
	    color: #fff;
	    overflow: hidden;
	    line-height: 35px;
        height: 35px;
	}
</style>